<script type="text/javascript" src="../../static/js/fileinput/fileinput.js"
        th:src="@{/js/fileinput/fileinput.js}"></script>
<link rel="stylesheet" href="../../static/css/fileinput/fileinput.css" type="text/css"
      th:href="@{/css/fileinput/fileinput.css}"/>

<style type="text/css">
    #map {
        position: relative;
        height: 510px;
        border: 1px solid #3473b7;
    }

    #toolbar {
        position: relative;
        padding-top: 5px;
        padding-bottom: 10px;
    }

    .win_bg {
        background: #CCC;
        opacity: 0.2;
        filter: alpha(opacity=20);
        position: absolute;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        z-index: 998;
    }

    .winTitle {
        background: #337ab7;
        height: 25px;
        line-height: 25px
    }

    .winTitle .title_left {
        font-weight: bold;
        color: #FFF;
        padding-left: 5px;
        float: left
    }

    .winTitle .title_right {
        float: right;
        padding-right: 3px;
    }

    .winTitle .title_right a {
        color: #FFF;
        text-decoration: none;
        padding-right: 3px;
    }

    .winTitle .title_right a:hover {
        text-decoration: underline;
        color: #FF0000;
        padding-right: 3px;
    }

    .transferPreference {
        border: 1px solid #D6E3F1;
        height: 20px;
        margin: 1px 30%;
        padding: 0 12px;
    }

    .winContent {
        padding: 5px;
        overflow-y: auto;
        height: 550px;
    }

    .popupWindow {
        right: 20px;
        top: 100px;
        position: absolute;
        width: 400px;
        height: 600px;
        border: 2px solid #D6E3F1;
        background: #FFF;
        z-index: 9999;
    }

    .label-color {
        background-color: #4d98dd;
        color: #ffffff;
    }
</style>
<form id="eventAddForm" method="post" action="" enctype="multipart/form-data" data-parsley-validate=""
      class="form-horizontal form-label-left" novalidate="">
    <div class="row">
        <div class="col-md-4">
            <div class="x_panel">
                <div class="x_title">
                    <h2 style="width: 100%">社区信息员上报
                        <small></small>
                    </h2>
                    <div class="clearfix"></div>
                </div>
                <div class="x_content">

                    <div class="col-md-6" style="display: none">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12">用户：</label>
                            <div class="col-md-9 col-sm-3">
                                <input type="text" class="form-control" id="empId" name="empId" th:value="${emp?.empId}"/>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-12" style="display: none">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12">事件类型：</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <select class="select2_single form-control" tabindex="-1" name="eventType" id="eventType" onchange="judgeType()">
                                    <option value="网格类" >网格类</option>

                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12" style="display: none">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12">上报至：</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <select class="select2_single form-control" tabindex="-1" name="outcome" id="outcome" disabled>
                                    <!--<option value="">&#45;&#45;请选择&#45;&#45;</option>-->
                                    <!--<option value="上报社区">上报社区</option>-->
                                    <!--<option value="直报街道">直报街道</option>-->
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12">事件标题：</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" name="eventTitle" id="event_title" class="form-control" value=""/>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12">事件位置：</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" name="eventLocation" id="event_location" class="form-control" value=""/>
                            </div>
                        </div>
                    </div>
                    <!--<div class="col-md-12">-->
                        <!--<div class="form-group">-->
                            <!--<label class="control-label col-md-3 col-sm-3 col-xs-12">网格：</label>-->
                            <!--<div class="col-md-9 col-sm-3">-->
                                <!--<input type="hidden" class="form-control" id="grid_id" name="gridId" value="1"/>-->

                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <div class="col-md-12">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12">经度：</label>
                            <div class="col-md-9 col-sm-4 col-xs-12">
                                <input id="lng" readonly="readonly" type="text" class="form-control" name="lng" value=""/>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12">纬度：</label>
                            <div class="col-md-9 col-sm-4 col-xs-12">
                                <input id="lat" readonly="readonly" type="text" class="form-control" name="lat" value=""/>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="form-group">
                            <label class="control-label col-md-3 col-sm-3 col-xs-12" >事件详情：</label>
                            <div class="col-md-9 col-sm-9 col-xs-12" >
                                <textarea class="form-control" rows="3" name="eventContent" id="event_content"></textarea>
                            </div>
                        </div>
                    </div>
                    <input type="hidden" id="eventStatus" name="eventStatus"/>
                    <!--<div class="col-md-12">-->
                        <!--<div class="form-group">-->
                            <!--<label class="control-label col-md-3 col-sm-3 col-xs-12">图片：</label>-->
                            <!--<div class="col-md-9 col-sm-9 col-xs-12">-->
                                <!--<input type="file" id="imgFile" name="imgFile"/>-->
                                <!--<input type="hidden" id="imgStr" name="imgStr"/>-->
                            <!--</div>-->
                        <!--</div>-->
                        <!--<div class="form-group">-->
                            <!--<label class="control-label col-md-3 col-sm-3 col-xs-12">音频：</label>-->
                            <!--<div class="col-md-9 col-sm-9 col-xs-12">-->
                                <!--<input type="file" id="audioFile" name="audioFile"/>-->
                                <!--<input type="hidden" id="audioStr" name="audioStr"/>-->
                            <!--</div>-->
                        <!--</div>-->
                        <!--<div class="form-group">-->
                            <!--<label class="control-label col-md-3 col-sm-3 col-xs-12">视频：</label>-->
                            <!--<div class="col-md-9 col-sm-9 col-xs-12">-->
                                <!--<input type="file" id="vedioFile" name="vedioFile"/>-->
                                <!--<input type="hidden" id="vedioStr" name="vedioStr"/>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <div class="ln_solid col-md-12"></div>
                    <div class="col-md-12 col-md-offset-3">
                        <div class="form-group">
                            <!--onclick="save()"-->
                            <button type="button" id="validateBtn" class="btn btn-success" >上报案件</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-8">
            <div class="x_panel">
                <div id='result' class='container'></div>
                <div id="map" style=" width: 100%;">
                </div>
            </div>
        </div>
    </div>
</form>
<!-- 上传 -->
<script type="text/javascript" th:inline="javascript">
    $("#imgFile").fileinput({
        language: 'zh', //设置语言
        uploadUrl: "/event/getImgFileName", //上传的地址
        allowedFileExtensions: ['jpg', 'gif', 'png'],//接收的文件后缀
        //uploadExtraData:{"id": 1, "fileName":'123.mp3'},
        uploadAsync: true, //默认异步上传
        showUpload: true, //是否显示上传按钮
        showRemove: true, //显示移除按钮
        showPreview: true, //是否显示预览
        showCaption: false,//是否显示标题
        browseClass: "btn btn-primary", //按钮样式
        dropZoneEnabled: false,//是否显示拖拽区域
        //minImageWidth: 50, //图片的最小宽度
        //minImageHeight: 50,//图片的最小高度
        //maxImageWidth: 1000,//图片的最大宽度
        //maxImageHeight: 1000,//图片的最大高度
        //maxFileSize:0,//单位为kb，如果为0表示不限制文件大小
        //minFileCount: 0,
        maxFileCount: 10, //表示允许同时上传的最大文件个数
        enctype: 'multipart/form-data',
        validateInitialCount: true,
        previewFileIcon: "<iclass='glyphicon glyphicon-king'></i>",
        msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
    }).on("fileuploaded", function (event, data, previewId, index) {
        $("#imgStr").val(data.response);
    });

    $("#audioFile").fileinput({
        language: 'zh', //设置语言
        uploadUrl: "/event/getAudioFileName", //上传的地址
        allowedFileExtensions: ['mp3'],//接收的文件后缀
        //uploadExtraData:{"id": 1, "fileName":'123.mp3'},
        uploadAsync: true, //默认异步上传
        showUpload: true, //是否显示上传按钮
        showRemove: true, //显示移除按钮
        showPreview: true, //是否显示预览
        showCaption: false,//是否显示标题
        browseClass: "btn btn-primary", //按钮样式
        dropZoneEnabled: false,//是否显示拖拽区域
        //minImageWidth: 50, //图片的最小宽度
        //minImageHeight: 50,//图片的最小高度
        //maxImageWidth: 1000,//图片的最大宽度
        //maxImageHeight: 1000,//图片的最大高度
        //maxFileSize:0,//单位为kb，如果为0表示不限制文件大小
        //minFileCount: 0,
        maxFileCount: 10, //表示允许同时上传的最大文件个数
        enctype: 'multipart/form-data',
        validateInitialCount: true,
        previewFileIcon: "<iclass='glyphicon glyphicon-king'></i>",
        msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
    }).on("fileuploaded", function (event, data, previewId, index) {
        $("#audioStr").val(data.response);
    });

    $("#vedioFile").fileinput({
        language: 'zh', //设置语言
        uploadUrl: "/event/getVedioFileName", //上传的地址
        allowedFileExtensions: ['mp4', 'avi'],//接收的文件后缀
        //uploadExtraData:{"id": 1, "fileName":'123.mp3'},
        uploadAsync: true, //默认异步上传
        showUpload: true, //是否显示上传按钮
        showRemove: true, //显示移除按钮
        showPreview: true, //是否显示预览
        showCaption: false,//是否显示标题
        browseClass: "btn btn-primary", //按钮样式
        dropZoneEnabled: false,//是否显示拖拽区域
        //minImageWidth: 50, //图片的最小宽度
        //minImageHeight: 50,//图片的最小高度
        //maxImageWidth: 1000,//图片的最大宽度
        //maxImageHeight: 1000,//图片的最大高度
        //maxFileSize:0,//单位为kb，如果为0表示不限制文件大小
        //minFileCount: 0,
        maxFileCount: 10, //表示允许同时上传的最大文件个数
        enctype: 'multipart/form-data',
        validateInitialCount: true,
        previewFileIcon: "<iclass='glyphicon glyphicon-king'></i>",
        msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
    }).on("fileuploaded", function (event, data, previewId, index) {
        $("#vedioStr").val(data.response);
    });
</script>
<!-- 校验 -->
<script type="text/javascript" th:inline="javascript">
    $(document).ready(function () {
        $('form').bootstrapValidator({
            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {  //
                eventLocation: {
                    validators: {
                        notEmpty: {
                            message: '请输入事件位置'
                        }
                    }
                },
                eventTitle: {
                    validators: {
                        notEmpty: {
                            message: '请输入事件标题'
                        }
                    }
                },
                empId: {
                    validators: {
                        notEmpty: {
                            message: '请输入用户'
                        }
                    }
                },
                eventContent: {
                    validators: {
                        notEmpty: {
                            message: '请输入事件详情'
                        }
                    }
                },
                outcome: {
                    validators: {
                        notEmpty: {
                            message: '请输入上报至'
                        }
                    }
                },
                eventType: {
                    validators: {
                        notEmpty: {
                            message: '请选择事件类型'
                        }
                    }
                },
                grid_name: {
                    validators: {
                        notEmpty: {
                            message: '请输入网格'
                        }
                    }
                },
                lng: {
                    validators: {
                        notEmpty: {
                            message: '请选择经度'
                        }
                    }
                },
                lat: {
                    validators: {
                        notEmpty: {
                            message: '请选择纬度'
                        }
                    }
                }
            }
        });

        $('#validateBtn').click(function () {
            $('form').bootstrapValidator('validate');
            var flag = $('form').data('bootstrapValidator').isValid();
            if (flag) {
                /*judgeEventActive();*/
                eventActive();
            } else {
                return;
            }

        });
    });
</script>
<!-- 树 -->
<script type="text/javascript" th:inline="javascript">
    /*<![CDATA[*/
    //树的数据
    var vaodes = eval([[${eventType}]]);
    function zTreeOnClick(event, treeId, treeNode) {
        var node = treeNode.getParentNode();
        var gnode = node.getParentNode();
        var eventTypeName = "";
        if (gnode != null) {
            eventTypeName += gnode.eventTypeName + "  ";
            if (gnode.eventTypeName == "部件") {
                $("#codeDiv").show();
                unitStatus = 1;
            }
            if (gnode.eventTypeName == "案件") {
                $("#codeDiv").hide();
                $("#unitCode").val("");
                $("#unitId").val("");
            }
        }
        if (node != null) {
            eventTypeName += node.eventTypeName + "   ";
            if (node.eventTypeName == "部件") {
                $("#codeDiv").show();
                unitStatus = 1;
            }
            if (node.eventTypeName == "案件") {
                $("#codeDiv").hide();
                $("#unitCode").val("");
                $("#unitId").val("");
            }
        }
        if (treeNode != null) {
            eventTypeName += treeNode.eventTypeName;
            if (treeNode.eventTypeName == "部件") {
                $("#codeDiv").show();
                unitStatus = 1;
            }
            if (treeNode.eventTypeName == "案件") {
                $("#codeDiv").hide();
                $("#unitCode").val("");
                $("#unitId").val("");
            }
        }
        $("#typeName").val(eventTypeName);
        $("#typeId").val(treeNode.eventTypeId);
        $('form').data('bootstrapValidator').updateStatus('typeName', 'NOT_VALIDATED', null).validateField('typeName');
        $('#myModal').modal('hide');
    };
    var setting = {
        callback: {
            onClick: zTreeOnClick
        },
        check: {
            enable: false,
            chkStyle: "radio"
        },
        data: {//数据加载
            keep: {
                parent: true,
                leaf: true
            },
            simpleData: {
                enable: true,
                idKey: "eventTypeId",
                pIdKey: "parentEventTypeId"
            },
            key: {
                name: "eventTypeName"
            }

        }
    };

    $(function () {
        var treeObj = $.fn.zTree.init($("#tree"), setting, vaodes);
        treeObj.expandAll(true);
    });

    /*]]>*/
</script>
<!-- 地图 -->
<script type="text/javascript" th:inline="javascript">
    /*<![CDATA[*/
    var SERVERIP = [[${SERVERIP}]];
    var LNGLOA = [[${LNG}]];
    var LATLOA = [[${LAT}]];
    var map, layer, vectorLayer, layerHarbin, layerJZ, layerJG, vectorLayer1, gpsLine, eventLayer, heatMapLayer,
        markerLayer,
        drawPoint, resultLayer, infowin,
        styleLine = {
            strokeColor: "blue",
            strokeWidth: 3,
            strokeLinecap: "round",
            strokeDashstyle: "solid"
        },
        style = {
            strokeColor: "#304DBE",
            strokeWidth: 1,
            pointerEvents: "visiblePainted",
            fillColor: "#304DBE",
            fillOpacity: 0.5
        },
        url1 = SERVERIP + HB_SERVER_IP,
        urlJZ = SERVERIP + BJ_JZ_SERVER,
        urlJG = SERVERIP + BJ_JG_SERVER,
        urlJZDate = SERVERIP + BJ_GEOGRAPHY_DATA,
        urlJZMap = SERVERIP + BJ_GEOGRAPHY_MAP,
        url2 = SERVERIP + HB_SERVER_CH;//地图中文服务地址
    $(function () {

        mapHW();

        layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url1, null, {maxResolution: "auto"});
        layer.events.on({"layerInitialized": addLayer1});
        /*heatMapLayer = new SuperMap.Layer.HeatMapLayer("heatMap", {"radius": 40, "featureWeight": "value", "featureRadius": "geoRadius"});*/
        vectorLayer = new SuperMap.Layer.Vector("Vector Layer");
        vectorLayer1 = new SuperMap.Layer.Vector("Vector Layer1");
        resultLayer = new SuperMap.Layer.Vector("Result Layer");
        markerLayer = new SuperMap.Layer.Markers("Markers");
        eventLayer = new SuperMap.Layer.Markers("事件变色");

        /*点查询*/
        drawPoint = new SuperMap.Control.DrawFeature(vectorLayer, SuperMap.Handler.Point);
        drawPoint.events.on({"featureadded": drawPointCompleted});

        map = new SuperMap.Map("map", {
            controls: [
//            new SuperMap.Control.LayerSwitcher(),
                new SuperMap.Control.ScaleLine(),
                new SuperMap.Control.Zoom(),
                new SuperMap.Control.Navigation({
                    dragPanOptions: {
                        enableKinetic: true
                    }
                })
                , drawPoint
            ],
            units: "m", allOverlays: true
        });

        /*bufferAnalystProcess();*/
        /*createHeatPoints();*/
        bufferAnalystProcessForJG();
    });

    /*中文注释*/
    function addLayer1() {
        layerHarbin = new SuperMap.Layer.TiledDynamicRESTLayer("中文注释", url2, {
            transparent: true,
            cacheEnabled: true
        });
        layerHarbin.events.on({
            "layerInitialized": addLayer3
        });
        layerHarbin.setOpacity(0.9);
    }

    /*基站*/
//    function addLayer2() {
//        layerJZ = new SuperMap.Layer.TiledDynamicRESTLayer("基站", urlJZ, {
//            transparent: true,
//            cacheEnabled: true
//        });
//        layerJZ.events.on({
//            "layerInitialized": addLayer3
//        });
//        layerJZ.setOpacity(0.9);
//    }

    /*井盖*/
    function addLayer3() {
        layerJG = new SuperMap.Layer.TiledDynamicRESTLayer("井盖", urlJG, {
            transparent: true,
            cacheEnabled: true
        });
        layerJG.events.on({
            "layerInitialized": addLayer4
        });
        layerJG.setOpacity(0.9);
    }

    /*载入涂层*/
    function addLayer4() {
        map.addLayers([layer]);
        map.addLayers([vectorLayer, resultLayer, vectorLayer1]);
        map.addLayers([markerLayer, eventLayer]);
        map.addLayers([layerHarbin,layerJG/*, layerJZ, heatMapLayer*/]);
        map.setCenter(new SuperMap.LonLat(LNGLOA, LATLOA), 13);
        drawPoint.activate();
    }

    /*获取基站坐标*/
    function getFeaturesBySQLForJZ() {
        vectorLayer.removeAllFeatures();
        var getFeatureParam, getFeatureBySQLService, getFeatureBySQLParams;
        getFeatureParam = new SuperMap.REST.FilterParameter({
            name: "BaseStation@jizhan",
            attributeFilter: "SMID > 0"
        });
        getFeatureBySQLParams = new SuperMap.REST.GetFeaturesBySQLParameters({
            queryParameter: getFeatureParam,
            datasetNames: ["jizhan:BaseStation"]
        });
        getFeatureBySQLService = new SuperMap.REST.GetFeaturesBySQLService(urlJZDate, {
            eventListeners: {"processCompleted": processCompleted, "processFailed": processFailed}
        });
        getFeatureBySQLService.processAsync(getFeatureBySQLParams);
    }

    function processCompleted(getFeaturesEventArgs) {
        var list = getFeaturesEventArgs.originResult.features;

        for (var i = 0; i < list.length; i++) {
            console.log(list[i].fieldValues[0] + "-@-" + list[i].fieldValues[1] + "-@-" + list[i].fieldValues[2]);
        }
    }

    /* 生成线 */
    function getLine(points) {
        var pathFeature = new SuperMap.Feature.Vector();
        gpsLine = new SuperMap.Geometry.LineString(points);
        pathFeature.geometry = gpsLine;
        pathFeature.style = styleLine;
        resultLayer.addFeatures(pathFeature);
    }

    /*基站范围*/
    function bufferAnalystProcess() {
        resultLayer.removeAllFeatures();
        var bufferServiceByDatasets = new SuperMap.REST.BufferAnalystService(urlJZMap),
            bufferDistance = new SuperMap.REST.BufferDistance({
                value: 250
            }),
            bufferSetting = new SuperMap.REST.BufferSetting({
                endType: SuperMap.REST.BufferEndType.ROUND,
                leftDistance: bufferDistance,
                rightDistance: bufferDistance,
                semicircleLineSegment: 10
            }),
            filterParameter = new SuperMap.REST.FilterParameter({
                attributeFilter: "SMID>0"
            }),
            dsBufferAnalystParameters = new SuperMap.REST.DatasetBufferAnalystParameters({
                dataset: "BaseStation@jizhan",
                filterQueryParameter: filterParameter,
                bufferSetting: bufferSetting
            });
        bufferServiceByDatasets.events.on({
            "processCompleted": bufferAnalystCompleted,
            "processFailed": bufferAnalystFailed
        });
        bufferServiceByDatasets.processAsync(dsBufferAnalystParameters);
    }

    function bufferAnalystCompleted(args) {
        var styleRegion = {
            strokeColor: "#304DBE",
            strokeWidth: 2,
            pointerEvents: "visiblePainted",
            fillColor: "#304DBE",
            fillOpacity: 0.4
        };
        for(var i=0;i<args.result.recordset.features.length;i++){
            args.result.recordset.features[i].style = styleRegion;
        }

        resultLayer.addFeatures(args.result.recordset.features);
    }

    function bufferAnalystFailed(args) {
        alert(args.error.errorMsg);
    }

    /*井盖*/
    function bufferAnalystProcessForJG() {
        resultLayer.removeAllFeatures();
        var bufferServiceByDatasets = new SuperMap.REST.BufferAnalystService(urlJZMap),
            bufferDistance = new SuperMap.REST.BufferDistance({
                value: 100
            }),
            bufferSetting = new SuperMap.REST.BufferSetting({
                endType: SuperMap.REST.BufferEndType.ROUND,
                leftDistance: bufferDistance,
                rightDistance: bufferDistance,
                semicircleLineSegment: 10
            }),
            filterParameter = new SuperMap.REST.FilterParameter({
                attributeFilter: "SMID>0"
            }),
            dsBufferAnalystParameters = new SuperMap.REST.DatasetBufferAnalystParameters({
                dataset: "WellCover@jinggai",
                filterQueryParameter: filterParameter,
                bufferSetting: bufferSetting
            });
        bufferServiceByDatasets.events.on({
            "processCompleted": bufferAnalystCompleted,
            "processFailed": bufferAnalystFailed
        });
        bufferServiceByDatasets.processAsync(dsBufferAnalystParameters);
    }

    function bufferAnalystCompleted(args) {
        var styleRegion = {
            strokeColor: "#304DBE",
            strokeWidth: 2,
            pointerEvents: "visiblePainted",
            fillColor: "#304DBE",
            fillOpacity: 0.4
        };
        args.result.recordset.features[0].style = styleRegion;
        resultLayer.addFeatures(args.result.recordset.features);
    }

    function bufferAnalystFailed(args) {
        alert(args.error.errorMsg);
    }

    /*点击事件*/
    function drawPointCompleted(drawGeometryArgs) {
        var feature = new SuperMap.Feature.Vector();
        feature.geometry = drawGeometryArgs.feature.geometry,
            feature.style = style;
        vectorLayer.addFeatures(feature);
        var point = feature.geometry;            //-------------------------
        centerPoint = point;
        queryByDistance();
    }

    function queryByDistance() {
        var queryByDistanceParams = new SuperMap.REST.QueryByDistanceParameters({
            queryParams: new Array(new SuperMap.REST.FilterParameter({name: "WellCover@jinggai"})),//Capitals@World.1
            returnContent: true,
            distance: 30,
            isNearest: true,
            expectCount: 1,
            geometry: centerPoint
        });
        var queryByDistanceService = new SuperMap.REST.QueryByDistanceService(urlJG);
        queryByDistanceService.events.on({
            "processCompleted": processCompleted,
            "processFailed": processFailed
        });
        queryByDistanceService.processAsync(queryByDistanceParams);
    }

    function processCompleted(queryEventArgs) {
        console.log(queryEventArgs.result.recordsets[0].features[0].data);
        console.log(queryEventArgs.result.recordsets[0].features[0].data.SmID);
        console.log(queryEventArgs.result.recordsets[0].features[0].data.SmX);
        console.log(queryEventArgs.result.recordsets[0].features[0].data.SmY);
        var id = queryEventArgs.result.recordsets[0].features[0].data.SmID;
        var x = queryEventArgs.result.recordsets[0].features[0].data.SmX;
        var y = queryEventArgs.result.recordsets[0].features[0].data.SmY;
        $("#lng").val(x);
        $("#lat").val(y);
        $("#eventStatus").val(id);
    }

    function processFailed(e) {
        alert(e.error.errorMsg);
    }

    /*突变事件*/
    function eventUp(lng, lat, level, data) {
        var size = new SuperMap.Size(25, 40);//图片大小限制
        var offset = new SuperMap.Pixel(-(size.w / 2), -size.h);//偏移量
        var icon = null;
        if (level === "0") icon = new SuperMap.Icon('../images/person_map.png', size, offset);
        if (level === "1") icon = new SuperMap.Icon('../images/1.gif', size, offset);
        if (level === "2") icon = new SuperMap.Icon('../images/1111.gif', size, offset);
        if (level === "4") icon = new SuperMap.Icon('../images/marker.png', size, offset);
        var marker = new SuperMap.Marker(new SuperMap.LonLat(lng, lat), icon);

        marker.events.on({//点击事件
            "click": function () {
                if (infowin) {
                    infowin.hide();//隐藏窗体对象
                    infowin.destroy();//消毁窗体对象
                }
                var marker = this;
                var contentHTML = "";
                contentHTML += "<div style='margin:25px 10px; padding:0;'>";
                contentHTML += "<p>部件编码:  " + data.unitCode + "</p>";
                contentHTML += "<p>部件类型:  " + data.unitTypeName + "</p>";
                contentHTML += "<p>主管部门:  " + data.deptMainName + "</p>";
                contentHTML += "<p>权属部门:  " + data.deptOwnerName + "</p>";
                contentHTML += "<p>养护部门:  " + data.deptKeepName + "</p>";
                contentHTML += "<p>初始时间:  " + data.startDate + "</p>";
                contentHTML += "<p>废弃时间:  " + data.finishDate + "</p>";
                contentHTML += "<p>材&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;质:  " + data.texture + "</p>";
                contentHTML += "<p>经&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;度:  " + data.lng + "</p>";
                contentHTML += "<p>纬&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;度:  " + data.lat + "</p>";
                // contentHTML += "<p>超时状态:  " + data.exceedTimeFlag + "</p>";
                contentHTML += "</div>";
                var lonlat = marker.getLonLat();//获取点击的坐标
                var size = new SuperMap.Size(0, 0);//初始位置移动量，按照点击的坐标偏移，(正数-右@负数-左，正数-上@负数-下)
                var offset = new SuperMap.Pixel(0, -20);//显示信息窗口的偏移量，(正数-右@负数-左，正数-下@负数-上)
                var icon = new SuperMap.Icon(null, size, offset);
                var popup = new SuperMap.Popup.FramedCloud(//定义内容
                    "popwin",
                    new SuperMap.LonLat(lonlat.lon, lonlat.lat),//获取坐标点
                    new SuperMap.Size(0, 0),
                    contentHTML,//append
                    icon,
                    true,
                    null);
                infowin = popup;
                map.addPopup(popup);
            }
        });

        eventLayer.addMarker(marker);
    }
    /*热力图*/
    function createHeatPoints() {
        clearHeatPoints();
        var heatPoints = [];
        $.post("/thermodynamic/getThermodynamic",function (data) {
            var num = data.data[0].countPopulation;
            // 热点半径,data代表事件数量
            var radius = 50, unit = "px", useGeoRadius = false;
            if ("degree" == unit) {
                useGeoRadius = true;
            }
            heatMapLayer.radius = radius;
            for (var i = 0; i < num; i++) {
                heatPoints[i] = new SuperMap.Feature.Vector(
                    new SuperMap.Geometry.Point(
                        data.data[i].lng,
                        data.data[i].lat
                    ),
                    {
                        "value": Math.random() * 4,
                        "geoRadius": null
                    }
                );
            }
            heatMapLayer.addFeatures(heatPoints);
        });
    }
    /*基站热力图*/
    function createHeatPointsForJZ(id) {
        clearHeatPoints();
        var heatPoints = [];
        $.post("/thermodynamic/getThermodynamicForJZ",{"id":id},function (data) {
            var num = data.data[0].countPopulation;
            // 热点半径,data代表事件数量
            var radius = 50, unit = "px", useGeoRadius = false;
            if ("degree" == unit) {
                useGeoRadius = true;
            }
            heatMapLayer.radius = radius;
            for (var i = 0; i < num; i++) {
                heatPoints[i] = new SuperMap.Feature.Vector(
                    new SuperMap.Geometry.Point(
                        data.data[i].lng,
                        data.data[i].lat
                    ),
                    {
                        "value": Math.random() * 4,
                        "geoRadius": null
                    }
                );
            }
            heatMapLayer.addFeatures(heatPoints);
        });
    }
    function clearHeatPoints() {
        heatMapLayer.removeAllFeatures();
    }
    /*清空*/
    function clearStatus() {
        vectorLayer.removeAllFeatures();
        vectorLayer1.removeAllFeatures();
        markerLayer.clearMarkers();
    }

    function mapHW() {
        var hei = $(window).height();
        $("#map").css("height", hei - 50 + "px");

        $(window).resize(function () {
            var hei = $(window).height();
            $("#map").css("height", hei - 50 + "px");
        });
    }

    /*]]>*/
</script>
<script type="text/javascript" th:inline="javascript">
    /*<![CDATA[*/


    /*]]>*/
</script>
<!--<script type="text/javascript" th:inline="javascript">-->
    <!--/*<![CDATA[*/-->
    <!--$("#map").height($(window).height()-120);-->
    <!--$(window).resize(function () {-->
        <!--$("#map").height($(window).height()-120);-->
    <!--});-->
    <!--var SERVERIP = [[SERVERIP]], LNG = [[LNG]], LAT = [[LAT]];-->
    <!--var map, local,layerCH, layer, layerHarbin, vectorLayer, vectorLayer1, drawPolygon2, markerLayer, drawPoint, drawLine,-->
        <!--style,-->
        <!--url =SERVERIP+ HB_SERVER_IP,-->
        <!--urlCH = SERVERIP + HB_SERVER_CH,-->
        <!--url1 =SERVERIP+ HB_GRID_SERVER,-->
        <!--url2 =SERVERIP+ HB_DATA_SERVER;-->
    <!--var str = "";-->

    <!--var b = new Array();-->
    <!--var flag = 0;-->
    <!--$(function () { // 页面初始化方法-->
        <!--var a = new Array();-->
        <!--$.getJSON("/grid/queryallGrid", function (data) {-->
            <!--$(data.cgGridList).each(function (index, item) {-->
                <!--var gridId = item.gridId;-->
                <!--$.getJSON("/grid/queryGridCell/" + gridId, function (data) {-->
                    <!--a = [];-->
                    <!--var obj = eval(data.list);-->
                    <!--for (var o in obj) {-->
                        <!--a.push(obj[o]);-->
                    <!--}-->
                    <!--split_array(a, 1000); //拆分数组按照每组1000个元素的要求进行拆分-->
                <!--});-->
            <!--});-->
            <!--layer = new SuperMap.Layer.TiledDynamicRESTLayer("城市地图", url, null, {-->
                <!--maxResolution: "auto"-->
            <!--});-->
            <!--layer.events.on({-->
                <!--"layerInitialized": addLayer1-->
            <!--});-->
            <!--vectorLayer = new SuperMap.Layer.Vector("Vector Layer");-->
            <!--vectorLayer1 = new SuperMap.Layer.Vector("Vector Layer1");-->
            <!--markerLayer = new SuperMap.Layer.Markers("Markers");-->

            <!--//多边形查询-->
            <!--drawPolygon2 = new SuperMap.Control.DrawFeature(vectorLayer1, SuperMap.Handler.Polygon);-->
            <!--drawPolygon2.events.on({-->
                <!--"featureadded": drawCompleted-->
            <!--});-->

            <!--//点查询-->
            <!--drawPoint = new SuperMap.Control.DrawFeature(vectorLayer1, SuperMap.Handler.Point);-->
            <!--drawPoint.events.on({-->
                <!--"featureadded": drawPointCompleted-->
            <!--});-->

            <!--//线查询-->
            <!--drawLine = new SuperMap.Control.DrawFeature(vectorLayer1, SuperMap.Handler.Path);-->
            <!--drawLine.events.on({-->
                <!--"featureadded": drawPointCompleted-->
            <!--});-->
            <!--drawLine.insertXY(14085312.662078, 5722404.236636);-->

            <!--map = new SuperMap.Map("map", {-->
                <!--controls: [-->
                    <!--new SuperMap.Control.LayerSwitcher(),-->
                    <!--new SuperMap.Control.ScaleLine(),-->
                    <!--new SuperMap.Control.Zoom(),-->
                    <!--new SuperMap.Control.Navigation({-->
                        <!--dragPanOptions: {-->
                            <!--enableKinetic: true-->
                        <!--}-->
                    <!--}),-->
                    <!--drawPolygon2, drawPoint, drawLine-->
                <!--],-->
                <!--units: "m", allOverlays: true-->
            <!--});-->

            <!--//加载-->
            <!--function addLayer1() {-->
                <!--layerCH = new SuperMap.Layer.TiledDynamicRESTLayer("中文注释", urlCH, {-->
                    <!--transparent: true,-->
                    <!--cacheEnabled: true-->
                <!--});-->
                <!--layerCH.events.on({-->
                    <!--"layerInitialized": addLayer2-->
                <!--});-->
                <!--layerCH.setOpacity(0.9);-->
            <!--}-->

            <!--function addLayer2() {-->
                <!--layerHarbin = new SuperMap.Layer.TiledDynamicRESTLayer("哈尔滨网格地图", url1, {-->
                    <!--transparent: true,-->
                    <!--cacheEnabled: true-->
                <!--});-->
                <!--layerHarbin.events.on({-->
                    <!--"layerInitialized": addLayer3-->
                <!--});-->
            <!--}-->

            <!--function addLayer3() {-->
                <!--map.addLayers([layer,layerCH, layerHarbin, vectorLayer, vectorLayer1, markerLayer]);-->
                <!--map.setCenter(new SuperMap.LonLat(LNG,LAT), 13);-->
                <!--drawPoint.activate();-->
            <!--}-->
        <!--});-->

        <!--//数组拆分-->
        <!--function split_array(arr, len) {-->
            <!--++flag;-->
            <!--if (flag > 7) {-->
                <!--flag = 1;-->
            <!--}-->
            <!--var a_len = arr.length;-->
            <!--var result = [];-->
            <!--for (var i = 0; i < a_len; i += len) {-->
                <!--result.push(arr.slice(i, i + len))-->
            <!--}-->
            <!--for (var n = 0; n < result.length; n++) {-->
                <!--getFeaturesByIDs(result[n]);//生成责任网格-->
            <!--}-->
        <!--}-->

        <!--//画点激活-->
        <!--$("#btn01").click(function () {-->
            <!--deactiveAll();-->
            <!--drawPoint.activate();-->
        <!--});-->

        <!--//画线激活-->
        <!--$("#btn02").click(function () {-->
            <!--deactiveAll();-->
            <!--drawLine.activate();-->
        <!--});-->

        <!--//画多边形激活-->
        <!--$("#btn03").click(function () {-->
            <!--deactiveAll();-->
            <!--drawPolygon2.activate();-->
        <!--});-->

        <!--function drawCompleted(drawGeometryArgs) {-->
            <!--var feature = new SuperMap.Feature.Vector();-->
            <!--feature.geometry = drawGeometryArgs.feature.geometry,-->
                <!--feature.style = style;-->
            <!--vectorLayer1.addFeatures(feature);-->

            <!--var queryParam, queryByGeometryParameters, queryService;-->
            <!--queryParam = new SuperMap.REST.FilterParameter({-->
                <!--name: "BuildRegion_habin@china"-->
            <!--});-->
            <!--queryByGeometryParameters = new SuperMap.REST.QueryByGeometryParameters({-->
                <!--queryParams: [queryParam],-->
                <!--geometry: drawGeometryArgs.feature.geometry,-->
                <!--spatialQueryMode: SuperMap.REST.SpatialQueryMode.INTERSECT-->
            <!--});-->
            <!--queryService = new SuperMap.REST.QueryByGeometryService(url1, {-->
                <!--eventListeners: {-->
                    <!--"processCompleted": processCompleted,-->
                    <!--"processFailed": processFailed-->
                <!--}-->
            <!--});-->
            <!--queryService.processAsync(queryByGeometryParameters);-->
        <!--}-->

        <!--function drawPointCompleted(drawGeometryArgs) {-->

            <!--var feature = new SuperMap.Feature.Vector();-->
            <!--feature.geometry = drawGeometryArgs.feature.geometry,-->
                <!--feature.style = style;-->
            <!--vectorLayer1.addFeatures(feature);// 根据点的位置画线或画点-->

            <!--var queryParam, queryByGeometryParameters, queryService;-->
            <!--queryParam = new SuperMap.REST.FilterParameter({-->
                <!--name: "BuildRegion_habin@china"-->
            <!--});-->
            <!--queryByGeometryParameters = new SuperMap.REST.QueryByGeometryParameters({-->
                <!--queryParams: [queryParam],-->
                <!--geometry: drawGeometryArgs.feature.geometry,-->
                <!--spatialQueryMode: SuperMap.REST.SpatialQueryMode.INTERSECT-->
            <!--});-->
            <!--queryService = new SuperMap.REST.QueryByGeometryService(url1, {-->
                <!--eventListeners: {-->
                    <!--"processCompleted": processCompleted,-->
                    <!--"processFailed": processFailed-->
                <!--}-->
            <!--});-->
            <!--queryService.processAsync(queryByGeometryParameters);-->
        <!--}-->

        <!--//科学计数法转换普通数值-->
        <!--function scientificToNumber(num) {-->
            <!--var num = new Number(num);-->
            <!--$("#lng").val(num);-->

            <!--$('form').data('bootstrapValidator')-->
                <!--.updateStatus('lng', 'NOT_VALIDATED', null)-->
                <!--.validateField('lng');-->


        <!--}-->

        <!--//画网格地图-->
        <!--var flag = 1;-->

        <!--//点击责任网格获取单元网格SmID-->
        <!--function processCompleted(queryEventArgs) {-->
            <!--var i, j, result = queryEventArgs.result;-->
            <!--if (result && result.recordsets) {-->
                <!--for (i = 0, recordsets = result.recordsets, len = recordsets.length; i < len; i++) {-->
                    <!--if (recordsets[i].features) {-->
                        <!--for (j = 0; j < recordsets[i].features.length; j++) {-->
                            <!--var feature = recordsets[i].features[j];-->
                            <!--scientificToNumber(feature.data.SmSdriE);-->
                            <!--$("#lat").val(feature.data.SmSdriN);-->
                            <!--var SmID = feature.attributes.SmID;-->
                            <!--AjaxQueryGridName(SmID);-->

                            <!--$('form').data('bootstrapValidator')-->
                                <!--.updateStatus('lat', 'NOT_VALIDATED', null)-->
                                <!--.validateField('lat');-->
                        <!--}-->
                    <!--}-->
                <!--}-->
            <!--}-->
        <!--}-->

        <!--//查询网格名称-->
        <!--function AjaxQueryGridName(smid) {-->
            <!--$.post("/event/queryGridName", {"smid": smid}, function (result) {-->
                <!--if(result != null){-->
                    <!--$("#grid_name").val(result.gridName);-->
                    <!--$("#grid_id").val(result.gridId);-->
                    <!--$('form').data('bootstrapValidator')-->
                        <!--.updateStatus('grid_name', 'NOT_VALIDATED', null)-->
                        <!--.validateField('grid_name');-->
                <!--}else{-->
                    <!--$.MsgBox.Alert("提示", "该网格尚未分配责任人");-->
                <!--}-->
            <!--});-->
        <!--}-->

        <!--function processFailed(e) {-->
            <!--alert(e.error.errorMsg);-->
        <!--}-->

        <!--$("#btn04").click(function () {-->
            <!--vectorLayer1.removeAllFeatures();-->
            <!--markerLayer.clearMarkers();-->
            <!--$("#cellId").val("");-->
            <!--str = "";-->
            <!--deactiveAll();-->
        <!--})-->

        <!--function deactiveAll() {-->
            <!--drawPoint.deactivate();-->
            <!--drawLine.deactivate();-->
            <!--drawPolygon2.deactivate();-->
        <!--}-->

        <!--function getFeaturesByIDs(a) {-->
            <!--var getFeaturesByIDsParameters, getFeaturesByIDsService;-->
            <!--getFeaturesByIDsParameters = new SuperMap.REST.GetFeaturesByIDsParameters({-->
                <!--returnContent: true,-->
                <!--datasetNames: ["china:BuildRegion_habin"],-->
                <!--fromIndex: 0,-->
                <!--toIndex: -1,-->
                <!--IDs: a-->
            <!--});-->
            <!--getFeaturesByIDsService = new SuperMap.REST.GetFeaturesByIDsService(url2, {-->
                <!--eventListeners: {-->
                    <!--"processCompleted": processCompleted2,-->
                    <!--"processFailed": processFailed2-->
                <!--}-->
            <!--});-->
            <!--getFeaturesByIDsService.processAsync(getFeaturesByIDsParameters);-->
        <!--}-->

        <!--function processCompleted2(getFeaturesEventArgs) {-->
            <!--var i, len, features, feature, result = getFeaturesEventArgs.result;-->
            <!--flag++;-->
            <!--if (flag > 7) {-->
                <!--flag = 1;-->
            <!--}-->
            <!--if (flag == 1) {-->
                <!--if (result && result.features) {-->
                    <!--features = result.features-->
                    <!--for (i = 0, len = features.length; i < len; i++) {-->
                        <!--feature = features[i];-->
                        <!--style = {-->
                            <!--strokeColor: "#304DBE",-->
                            <!--strokeWidth: 1,-->
                            <!--fillColor: "#304DBE",-->
                            <!--fillOpacity: "0.3"-->
                        <!--};-->
                        <!--feature.style = style;-->
                        <!--vectorLayer.addFeatures(feature);-->
                    <!--}-->
                <!--}-->
            <!--} else if (flag == 2) {-->
                <!--if (result && result.features) {-->
                    <!--features = result.features-->
                    <!--for (i = 0, len = features.length; i < len; i++) {-->
                        <!--feature = features[i];-->
                        <!--style = {-->
                            <!--strokeColor: "#FF6699",-->
                            <!--strokeWidth: 1,-->
                            <!--fillColor: "#FF6699",-->
                            <!--fillOpacity: "0.3"-->
                        <!--},-->
                            <!--feature.style = style;-->
                        <!--vectorLayer.addFeatures(feature);-->
                    <!--}-->
                <!--}-->
            <!--} else if (flag == 3) {-->
                <!--if (result && result.features) {-->
                    <!--features = result.features-->
                    <!--for (i = 0, len = features.length; i < len; i++) {-->
                        <!--feature = features[i];-->
                        <!--style = {-->
                            <!--strokeColor: "#009966",-->
                            <!--strokeWidth: 1,-->
                            <!--fillColor: "#009966",-->
                            <!--fillOpacity: "0.3"-->
                        <!--},-->
                            <!--feature.style = style;-->
                        <!--vectorLayer.addFeatures(feature);-->
                    <!--}-->
                <!--}-->
            <!--} else if (flag == 4) {-->
                <!--if (result && result.features) {-->
                    <!--features = result.features-->
                    <!--for (i = 0, len = features.length; i < len; i++) {-->
                        <!--feature = features[i];-->
                        <!--style = {-->
                            <!--strokeColor: "#3333FF",-->
                            <!--strokeWidth: 1,-->
                            <!--fillColor: "#3333FF",-->
                            <!--fillOpacity: "0.3"-->
                        <!--},-->
                            <!--feature.style = style;-->
                        <!--vectorLayer.addFeatures(feature);-->
                    <!--}-->
                <!--}-->
            <!--} else if (flag == 5) {-->
                <!--if (result && result.features) {-->
                    <!--features = result.features-->
                    <!--for (i = 0, len = features.length; i < len; i++) {-->
                        <!--feature = features[i];-->
                        <!--style = {-->
                            <!--strokeColor: "#FFFF00",-->
                            <!--strokeWidth: 1,-->
                            <!--fillColor: "#FFFF00",-->
                            <!--fillOpacity: "0.3"-->
                        <!--},-->
                            <!--feature.style = style;-->
                        <!--vectorLayer.addFeatures(feature);-->
                    <!--}-->
                <!--}-->
            <!--} else {-->
                <!--if (result && result.features) {-->
                    <!--features = result.features-->
                    <!--for (i = 0, len = features.length; i < len; i++) {-->
                        <!--feature = features[i];-->
                        <!--style = {-->
                            <!--strokeColor: "#660033",-->
                            <!--strokeWidth: 1,-->
                            <!--fillColor: "#660033",-->
                            <!--fillOpacity: "0.3"-->
                        <!--},-->
                            <!--feature.style = style;-->
                        <!--vectorLayer.addFeatures(feature);-->
                    <!--}-->
                <!--}-->
            <!--}-->
        <!--}-->

        <!--function processFailed2(e) {-->
<!--//            alert(e.error.errorMsg);-->
        <!--}-->

        <!--function clearFeatures() {-->
            <!--//先清除上次的显示结果-->
            <!--vectorLayer.removeAllFeatures();-->
            <!--vectorLayer.refresh();-->
        <!--}-->

    <!--});-->

    <!--/*]]>*/-->
<!--</script>-->
<!-- 方法 -->
<script type="text/javascript" th:inline="javascript">
    /*<![CDATA[*/

    function judgeType() {
        $("#outcome").empty();
        var html="";

        if ($("#eventType").val() == "网格类") {
            $("#outcome").removeAttr("disabled");
//            html =  "<option value=\"\">&#45;&#45;请选择&#45;&#45;</option>\n" +
//                "            <option value=\"上报社区\">上报社区</option>\n" +
//                "      <option value=\"直报街道\">直报街道</option>";
            html =  "<option value=\"上报社区\">上报社区</option>\n";
            $("#outcome").append(html);


        } else {
            $("#outcome").attr("disabled", "disabled");
            html =  "<option value=\"\">&#45;&#45;请选择&#45;&#45;</option>\n";
            $("#outcome").append(html);

        }
    }

    function judgeEventActive() {
        if($("#imgFile").val() != "" && $("#imgStr").val() == ""){
            $.MsgBox.Alert("提示", "图片上传中，请耐心等待上传文件出现绿色对号！");
        }else{
            if($("#audioFile").val() != "" && $("#audioStr").val() == ""){
                $.MsgBox.Alert("提示", "音频上传中，请耐心等待上传文件出现绿色对号！");
            }else{
                if($("#vedioFile").val() != "" && $("#vedioStr").val() == ""){
                    $.MsgBox.Alert("提示", "视频上传中，请耐心等待上传文件出现绿色对号！");
                }else{
                    eventActive();
                }
            }
        }
    }

    function eventActive() {
        $("#unitCode").removeAttr("disabled");
        $.ajax({
            url: '/event/insertEvent',
            type: 'POST',
            async: false,
            cache: false,
            data: new FormData($('#eventAddForm')[0]),
            processData: false,
            contentType: false,
            success: function (result) {
                if (result == "上报成功") {
                    $.MsgBox.Alert("提示", "存入成功！");
                    $.goTo("/eventTurn/toEventList");
                } else {
                    $.MsgBox.Alert("提示", "请检查数据是否正确");
                }
            }
        })
    }
    /*]]>*/
</script>


